<template>
	<view class="content" >
		<form @submit="submit">
			<u-navbar :is-back="!get.uri">
				<view style="height: 10px;"></view>
				<view  class="slot-wrap disfr-lr p15 f32" style="width: 100%;">
					<view class="slot-wrap-left"></view>
					<view class="slot-wrap-center mt20">个人资料</view>
					<view class="slot-wrap-right pr">
						<button form-type="submit" style="height: 70rpx;background: none;">
							<view style="position: relative;top:-20rpx;">
								<u-icon name="duihao" custom-prefix="qxl-icon" size="44"></u-icon>
							</view>
						</button>
					</view>
				</view>
			</u-navbar>

			<view v-if="show_main" class="main" >
				<view class="disfr-lr bgf pv20">
					<view class="group-image" style="width: 80rpx;height: 80rpx;">
						<view @click="upload" class="pl20">
							<image :src="result.head_pic ? result.head_pic : '/static/image/default-user.png'"
							mode="widthFix" style="width: 80rpx;border-radius: 4px;"></image>
						</view>
						<input type="text" :value="result.head_pic" name="head_pic" class="hide"/>
					</view>
					<view style="width: 560rpx;text-align: right;">
						<view class="pr" style="height: 50rpx;">
							<input type="text" :value="result.nickname" name="nickname" class="mt30" style="border: none;width: 520rpx;height: 50rpx;"
							placeholder-style="color:#999999;font-size:32rpx;"
							 placeholder="*输入昵称"/>
						</view>
					</view>
				</view>
				
				<view class="bgf p30 f32 disfr-lr bto">
					<view class="pt10"><text>年龄</text></view>
					<view>
						<input type="number" :value="result.age" name="age" style="border: none;height: 50rpx;text-align: right;"
						placeholder-style="color:#999999;font-size:32rpx;"
						 placeholder="请输入年龄"/>
					 </view>
				</view>
				
				<view class="bgf p30 f32 disfr-lr bto">
					<view class="pt10"><text>性别</text></view>
					<view>
						<radio-group name="sex"> 
							<label>
								<radio value="1" :checked="result.sex == 1" style="transform:scale(0.7)" color="#2979ff"/>
								<text class="pr" style="left:-10rpx">男</text>
							</label>
							<label>
								<radio value="2" :checked="result.sex == 2" style="transform:scale(0.7);position: relative;right: -10rpx;" color="#2979ff"/>
								<text>女</text>
							</label>
						</radio-group>
					 </view>
				</view>
				
				<view class="bgf p30 f32 disfr-lr bto">
					<view class="pt10"><text>单位名称</text></view>
					<view>
						<input type="text" :value="result.corporate_name" name="corporate_name" style="border: none;height: 50rpx;text-align: right;"
						placeholder-style="color:#999999;font-size:32rpx;"
						 placeholder="请输入单位名称"/>
					 </view>
				</view>
				
				<view class="bgf p30 f32 disfr-lr bto">
					<view class="pt10"><text>职位</text></view>
					<view>
						<input type="text" :value="result.job_name" name="job_name" style="border: none;height: 50rpx;text-align: right;"
						placeholder-style="color:#999999;font-size:32rpx;"
						 placeholder="请输入职位"/>
					 </view>
				</view>
				
				<view class="bgf p30 f32 disfr-lr bto">
					<view class="pt10"><text>年收入</text></view>
					<view>
						<input type="text" :value="result.annual_income" name="annual_income" style="border: none;height: 50rpx;text-align: right;"
						placeholder-style="color:#999999;font-size:32rpx;"
						 placeholder="请输入年收入"/>
					 </view>
				</view>
				
				<view class="bgf p30 f32 disfr-lr bto">
					<view class="pt10"><text>微信号</text></view>
					<view>
						<input type="text" :value="result.wei_xin" name="wei_xin" style="border: none;height: 50rpx;text-align: right;"
						placeholder-style="color:#999999;font-size:32rpx;"
						 placeholder="请输入微信号"/>
					 </view>
				</view>
				
				<view class="bgf p30 f32 disfr-lr bto">
					<view class="pt10"><text>抖音号</text></view>
					<view>
						<input type="text" :value="result.dou_yin" name="dou_yin" style="border: none;height: 50rpx;text-align: right;"
						placeholder-style="color:#999999;font-size:32rpx;"
						 placeholder="请输入抖音号"/>
					 </view>
				</view>
				
				<view class="bgf p30 f32 disfr-lr bto">
					<view class="pt10"><text>快手号</text></view>
					<view>
						<input type="text" :value="result.kuai_shou" name="kuai_shou" style="border: none;height: 50rpx;text-align: right;"
						placeholder-style="color:#999999;font-size:32rpx;"
						 placeholder="请输入快手号"/>
					 </view>
				</view>
				
			</view>
		</form>
		<loading :loading="not_load"/><!--加载状态-->
	</view>
</template>

<script setup>
import { onLoad, onShow, onHide, onReachBottom, onPullDownRefresh } from '@dcloudio/uni-app';
import { ref } from 'vue';	
const show_main=ref(false);
const not_load=ref(false);
const result=ref({});
const get=ref({});
//页面加载时
onLoad(async (options)=>{
	get.value=options;
    loadPage(options,false);
});
//页面显示时执行
onShow(()=>{
	//console.log('语法糖onShow');
});
//页面隐藏时执行
onHide(()=>{
	//console.log('语法糖onHide');
});
/**
 * 加载接口数据
 * @param {Object} options  参数,对像数组
 * @param {Object} isPage   是否加载大于1页
 */
const loadPage=async (options,isPage)=>{
	let ret = await uni.$get('/appapi-member-setuser');
	show_main.value=true;
	not_load.value=true;
	if(ret.error_code != 0){
		uni.$utils.showToast(ret.info);
		return;
	}
	result.value=ret.data;
};
/**
 * 模板属性跳转页面
 * @param {Object} e
 */
function goPage(event){
	topDropDownShow.value=false;
	uni.$utils.dataSetPage(event);
};

//上传群图片
const groupAvatar=ref('');
const upload=async()=>{
	uni.chooseImage({
	    count: 1, // 最多选择 1 张图片
	    sourceType: ['album', 'camera'], // 图片来源为相册和相机
	    success: async (res) => {
	        //console.log('选择的图片路径：', res.tempFilePaths);
			let ret = await uni.$uploadFile('/appapi-upload-image',res.tempFilePaths[0],{width:160,height:160});
			let imgUrl=ret.data.url;
			if(!imgUrl) uni.$utils.showToast('头像上传失败');
			result.value.head_pic=imgUrl;
	    },
	    fail: function (err) {
	        //console.error('选择图片失败：', err);
	    }
	});
};
//提交表单
const submit=async(e)=>{
	if(!not_load.value) return;
	let form=e.detail.value;
	if(!form.head_pic){
		uni.$utils.showToast('头像必填');
		return;
	}
	if(!form.nickname){
		uni.$utils.showToast('昵称必填');
		return;
	}
	/*if(!form.wei_xin){
		uni.$utils.showToast('微信号必填');
		return;
	}*/
	//console.log(form);return;
	not_load.value=false;
	let ret=await uni.$post('/appapi-member-setuser',{},form);
	not_load.value=true;
	if(ret.error_code != 0){
		uni.$utils.showToast(ret.info);
		return;
	}
	uni.$utils.showToast(ret.info,0,()=>{
		if(get.value.uri){
			let uri=decodeURIComponent(get.value.uri);
			uni.$utils.goPage(uri,2);
			return;
		}
		uni.navigateBack({data:1});
	});
};
</script>

<style  lang="scss">
	page {
		
	}
.fnow{color:#2979ff;}
</style>
